<template>
    <div class='memberdata-container'>
        <div class="m-c-container" >
            <div class="member-info-tip">
                <span>个人资料</span>
            </div>
            <span style="font-size: 12px; font-weight: 400; color: #ff4400; margin-left: 20px;">亲爱的 {{ memberVo.account }}
                ，填写真实的资料</span>
            <div class="m-c-c-test">
                <div class="member-info">
                    <div class="m-c-c-headtip">
                        当前头像
                    </div>
                    <div class="m-c-c-headimg">
                        <img :src="memberVo.header" alt="">
                        <singleUpload></singleUpload>
                        <!-- <div @click="uploadHead()">
                        <label class="top" title="支持上传格式: jpg/jepg/png">修改头像
                            <input type="file" id="memberHead" style="display: none" @change="uploadHead()" />
                        </label>
                    </div> -->
                    </div>
                </div>
            </div>
            <div class="member-nickname">
                <div class="m-c-c-nicknametip">
                    名称
                </div>
                <div class="input-nickname">
                    <input type="text" v-model="memberVo.nickname">
                </div>
            </div>
            <div class="member-gender">
                <div class="member-gengertip">
                    性别
                </div>
                <div class="member-gender-info">
                    <span>
                        <label>
                            <input type="radio" name="gender" v-model="memberVo.gender" value=0
                                title="男">男&nbsp;&nbsp;&nbsp;
                        </label>
                    </span>
                    <span>
                        <label>
                            <input type="radio" name="gender" v-model="memberVo.gender" value=1
                                title="女">女&nbsp;&nbsp;&nbsp;
                        </label>
                    </span>
                    <span>
                        <label>
                            <input type="radio" name="gender" v-model="memberVo.gender" value=2
                                title="保密">保密&nbsp;&nbsp;&nbsp;
                        </label>
                    </span>
                </div>
            </div>
            <div class="submit-button">
                <div @click="saveMemberInfo()">
                    保存
                </div>
            </div>
        </div>
    </div>
</template>
<script>
// 导入组件
import singleUpload from '../common/singleUpload.vue'
// 导出模块
export default {
    // 模块名字
    name: 'memberdata',
    // 模块数据
    data() {
        //数据
        return {
            file: '',
            memberVo: [],
            nicknameGenderVo: {
                id: '',
                nickname: '',
                gender: ''
            },


        };
    },
    // 注册组件
    components: {
        singleUpload,
    },
    methods: {

        saveMemberInfo() {
            // 组装数据
            this.nicknameGenderVo.nickname = this.memberVo.nickname
            this.nicknameGenderVo.gender = this.memberVo.gender
            // 上传修改
            this.$http({
                url: this.$http.adornUrl("/shitou-member/shitoumember/member/updateInfo"),
                method: 'post',
                data: this.$http.adornData(this.nicknameGenderVo)
            }).then(({ data }) => {
                if (data.code == 200) {
                    this.$message({
                        type: 'success',
                        message: '修改信息成功'
                    })
                    // 修改本地数据
                    localStorage.setItem("userData", JSON.stringify(this.memberVo))
                } else {
                    this.$message({
                        type: 'warning',
                        message: data.message
                    })
                }
            })
        },


        clickRadio() {
            let radios = document.getElementsByName("gender");
        },

        // 加载本地数据
        async loadLocal() {
            let member = await this.$memberInfo()
            console.log(member)
            if ( member !== null) {
                this.memberVo = member
                this.nicknameGenderVo.id = member.id
                if (this.memberVo.header == null) {
                    this.memberVo.header = "../../assets/logo.png"
                }
                // 性别 0-1-2 【男，女，保密]
            } 
        }

    },
    created() {
        this.loadLocal();
    }
}
</script>
<style scoped>@import url("../../utils/css/memberdata.css");</style>
